<!-- 附件管理详情 -->
<template>
  <el-container class="attachmentDetails">
    <el-header height="36px">
      <header-title :title="$route.meta.title" />
    </el-header>
    <el-main class="mainDetails">
      <div>
        <!-- 基本信息 -->
        <jn-prj-detail :prj-id="prjId" :prj-type="prjType"/>
        <div>
          <SearchList title="档案归档数据" style="margin-top: 16px">
            <!-- <template #header-btn>
                <BtnConfig ref="btnConfigRef" :btn-configs="btnOption" />
              </template> -->
            <template #body>
              <archivingView ref="archivingViewRef" />
            </template>
          </SearchList>
        </div>
      </div>
    </el-main>
  </el-container>
</template>

<script>
    import HeaderTitle from '@/components/basic/HeaderTitle'
    import SearchList from '@/components/basic/SearchList'
    import archivingView from './archivingView.vue'
    import JnPrjDetail from '@/components/jn/JnPrjDetail.vue'
    // import BtnConfig from '@/components/basic/btnConfig.vue'
    import SysConst from '@/common/const'
    import { getDropdownData } from '@/api/common' // 字典接口
    import { getNodeInfoApi } from '@/api/attachManagement/attachments/attachmentDetails'
    import { getPrjStageApi } from '@/api/attachmentInfo'
    import { formOption } from '.'
    import TCollapse from '@/components/basic/TCollapse.vue'
    import Communication from '@/components/basicInformation/communication.vue'

    export default {
        name: 'Archiving',
        components: {
            HeaderTitle,
            SearchList,
            JnPrjDetail,
            archivingView,
            TCollapse,
            Communication
            // BtnConfig
        },
        data() {
            return {
                formOption,
                queryParams: {}, // 查询条件数据
                prjId: '', // 项目流水号
                prjType: '', // prjType=M  信息化的页面, 其他就是通信
                dicLists: {}, // 字典数据集合
                formVal: {} // 基础信息存放集合
            }
        },
        created() {
            this.prjId = this.$route.query.prjId
            this.prjType = this.$route.query.prjType
            this.getDictData()
            this.getPrjStage()
            // this.doSearch()
        },
        methods: {
            // 查看数据
            doSearch(item) {
                const params = {
                    prjId: this.prjId,
                    pageNum: item?.page || SysConst.CURRENT_PAGE,
                    pageSize: item?.limit || SysConst.PAGESIZE,
                    ...this.queryParams
                }
                this.$refs.archivingViewRef.queryPrjFileInfo(params, item)
            },
            // 查询条件事件
            handleEvent(prop, val) {
                if (prop === 'prjStage') {
                    this.getPrjNodeName(val)
                    this.queryParams.prjNodeId = ''
                }
            },
            // 重置
            // resetSearch() {
            //     this.$refs.formRef.reset()
            //     this.doSearch({
            //         page: 1,
            //         limit: 10
            //     })
            // },
            async getDictData() {
                const arr = ['SIGN_STATE']
                const promises = arr.map((item) => getDropdownData(item))
                const results = await Promise.all(promises)
                arr.forEach((item, i) => {
                    this.$set(this.dicLists, item, results[i].data ?? [])
                })
                this.$set(
                    this.dicLists,
                    'FILE_UPLOAD_MODES',
                    SysConst.UPLOAD_MODES
                )
            },
            // 获取项目阶段字典
            async getPrjStage() {
                const res = await getPrjStageApi()
                const data = res.data.map((item) => ({
                    dictId: item.key,
                    dictName: item.value
                }))
                this.$set(this.dicLists, 'PRO_STAGE', data)
            },
            // 获取项目节点字典
            async getPrjNodeName(val) {
                if (!val) {
                    return
                }
                const res = await getNodeInfoApi({
                    prjId: this.prjId,
                    prjStage: val ?? ''
                })
                if (!res.data.length) {
                    this.$message.info('此项目阶段下项目节点为空')
                }
                this.$set(this.dicLists, 'PRJ_NODE', res.data)
            }
        }
    }
</script>

  <style lang="scss" scoped>
.attachmentDetails {
    width: 100%;
}
.search-flex-box {
    // display: flex;
    // justify-content: space-between;
    height: auto;
}
.searchBtn {
    width: 100px;
    margin-left: auto;
    display: flex;
    margin-top: 4px;
    flex-direction: column;
    .el-button + .el-button {
        margin-left: 0;
        margin-top: 12px;
    }
}
.el-button + .el-button {
    margin-left: 0;
    margin-top: 6px;
}
.mainDetails {
    padding: 15px 25px;
}
</style>

